<template>
		<div @click.stop="onClickHandler" :class="[selected ?'m-row-selected-state' : 'm-row-normal-state']" style="position: relative;">
			<i class="el-icon-rank drag-widget" style="position: absolute;left: 0px;top:0px;z-index: 100;" v-show="selected"></i>
			<van-field v-model="vue_model" :label="componentModel.labelExpression" :placeholder="componentModel.labelExpression"/>
		</div>
</template>

<script>
	import utils from '@/utils/utils.js';
	import formDesignerUtil from '@/utils/formDesignerUtil.js';
	export default {
		name: "DesignFormulaComponent",
		props: ["componentModel"],
		data() {
			return {
				vue_model:"",
				selected:false,
				"propertySet": [
					{
						"key": "ID","label":"ID","editor":"label"
					},
					{
						"key": "dataSource","label":"数据源","editor":"select"
					},
					{
						"key": "dataField","label":"数据域","editor":"text"
					},
					{
						"key": "varName","label":"变量名","editor":"text"
					},
					{
						"key": "labelExpression","label":"标签","editor":"text"
					},
					{
						"key": "visible","label":"显示逻辑","editor":"textarea"
					},{
						"key": "onChangeExpression",
						"label": "值改变事件",
						"editor": "textarea"
					},
					{
						"key": "formulaExpression","label":"公式","editor":"textarea"
					},
					{
						"key": "dependFieldList","label":"依赖域","editor":"textarea"
					}
				]
			}
		},
		inject:['children'],
		mounted() {
			this.children.push(this);
		},beforeMount() {
			if(this.componentModel.labelExpression==undefined){
				formDesignerUtil.setComponentModelPropValue(this.componentModel,"labelExpression","公式");
			}
		},beforeUnmount() {
			utils.removeArrayElement(this.children,this);
		},
		methods: {
			onClickHandler(){
				formDesignerUtil.mobileComponentClickHandler(this);
			},getPropertyValue(propertyKey){
				if (propertyKey == "ID") {
					return formDesignerUtil.getComponentModelPropValue(this.componentModel,"id");
				} else if (propertyKey == "labelExpression") {
					return formDesignerUtil.getComponentModelPropValue(this.componentModel,"labelExpression");
				}
				return formDesignerUtil.getComponentModelCommonValue(this.componentModel,propertyKey);
			},setPropertyValue(propertyKey,propertyValue){
				formDesignerUtil.setComponentModelCommonValue(this.componentModel,propertyKey, propertyValue);
				if (propertyKey == "labelExpression") {
					formDesignerUtil.setComponentModelPropValue(this.componentModel,"labelExpression",propertyValue);
				}
			},setSelected(selected) {
				this.selected=selected;
			}
		},
	}
</script>

<style>
</style>
